<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
	
	<link rel="stylesheet" type="text/css" href="css/aaa.css"/>
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
	<link rel="stylesheet" type="text/css" href="css/jquery.page.css"/>
	<title>Document</title>
</head>
<body>
	<div id="yinying"></div>
	<div id="tousu">
		<h4>投诉建议</h4>

		<p class="tou-a">
			您好，如对我们的服务意见或建议，请发邮件至：<a href="#">tcb-fankui@bang.360.cn</a>详细说明
		</p>
		<button class="tou-btn">确定</button>
	</div>
	<div id="head">
		<div id="header">
			<p class="fl"><a href="#">北京</a> <span id="qiehuan"><a href="#">[切换城市] </a></span> 同城帮首页</p>
			<ul>
				<li><a href="#"><span class="denglu">登录</span> |</a></li>
				<li><a href="#"><span class="zhuce">注册</span> |</a></li>
				<li><a href="#">我的订单 |</a></li>
				<li><a href="#">在线客服(9:00-21.00) |</a></li>
				<li><a href="#"><span class="fuwu">客户服务</fuwu> |</a></li>
				<li><a href="#">谈论 |</a></li>
				<li><span class="jianyi">投诉建议</span></li>
			</ul>
		</div>
		<div id="denglu">
			<div class="deng-a">
				<h4>欢迎注册360同城帮</h4>
				<p class="guanbi1"><a href="#">×</a></p>
			</div>
			<div class="deng-b">
				<p><span>账号</span><input type="text" placeholder="手机号/用户名/邮箱" id="zhang"></p>
				<p><span>密码</span><input type="text" placeholder="请输入您的密码" name="" id="mima" value="" /></p>
				<p><input type="checkbox">下次自动登录</p>
				<button id="loginusername">立即登录</button>
			</div>
			<div class="deng-c">
				<p>注册新账号|<a href="#">忘记密码？</a></p>
			</div>
		</div>
		<div id="zhuce">
			<div class="zhu-a">
				<h4>欢迎注册360同城帮</h4>
				<p class="guanbi"><a href="#">×</a></p>
			</div>
			<div class="zhu-b">
				<div class="zhu-left">
					<p><a href="#">手机注册</a></p>
					<p><a href="#">邮箱注册</a></p>
				</div>
				<div class="zhu-right">
					<p><span>邮箱</span><input type="text" id="younames"></p>
					<p><span>密码</span><input type="password" id="pwd"></p>
				</div>
				<button id="createusers">注册</button>
			</div>
		</div>
		<div id="h-1">
			<div id="h1-a">
				<p>城市列表</p>
				<input type="button" name="" id="h1-aa" value="关闭×" />
			</div>
			<div id="h1-b">
				<p><span class="cc">热门</span> 北京 上海 广州 天津 西安 深圳 武汉 成都 重庆</p>
				<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;南京 沈阳 杭州 济南 郑州 青岛 苏州</p>
				<p><span class="cc">拼音</span> A B C D E F G H J K L M N P Q R S T W X Y Z </p>
				<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;安阳 安庆 安康 阿克苏 阿亲泰 鞍山 安西 安顺</p>
				<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;阿里地区 阿拉善盟 阿坝</p>
			</div>
		</div>
		<div id="h-2">
			<ul>
				<li>客户服务</li>
				<li>帮助中心</li>
				<li>维修付款</li>
			</ul>
		</div>
	</div>
	<div id="logo">
		<img src="images/35.png" />
		<ul>
			<li><a href="#">二手优品</a></li>
			<li><a href="#">手机维修</a></li>
			<li><a href="#">电脑维修</a></li>
			<li><a href="#">以旧换新</a></li>
			<li><a href="#">手机租用</a></li>
		</ul>
		<p class="logo-img"><img src="images/34.png"></p>
	</div>
	<div id="pic">
		<!--carousel slide  轮播图的包裹-->
		<div id="myCarousel" class="carousel slide">
			<!--carousel-indicators  轮播小按钮-->
			<ol class="carousel-indicators">
				<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
				<li data-target="#myCarousel" data-slide-to="1"></li>
				<li data-target="#myCarousel" data-slide-to="2"></li>
			</ol>
			<!--carousel-inner  存放轮播图片-->
			<div class="carousel-inner">
				<!--item  包裹图片的包裹载体-->
				<div class="item active"><img src="images/5.png" alt="第二张"></div>
				<div class="item"><img src="images/6.png" alt="第三张"></div>
			</div>
			<ul class="list-one">
				<li class="list-li">
					<img src="images/2_03.png"/>修手机/Pad
						<ul class="list">
							<!--<li><span class="p1">屏幕></span> 屏碎但显示正常 | 屏幕不显示花屏|屏幕触摸失灵|Pad更换屏幕</li>
							<li><span class="p1">电池/充电/开机></span>电池问题|不开机|充电（连接）问题</li>
							<li><span class="p1">按键></span>开关机键失灵|Home键 失灵|音量键失灵</li>
							<li><span class="p1">声音/震动></span>听筒问题|麦克风问题|外放扬声器问题|二级插口故障|震动功能失效</li>
							<li><span class="p1">拍照/录像></span>后摄像头无法拍照|前摄像头故障问题</li>
							<li><span class="p1">外壳/边框></span>中框变形|手机壳换彩壳</li>
							<li><span class="p1">进入水液/主板故障></span>进入水液|手机主板故障</li>
							<li><span class="p1">其他故障></span>手机主板刷新|手机wifi信号问题</li>
							<li><span class="p1">个性化服务></span>点亮iphone logo|设置个性化彩壳|蓝光护眼钢化膜|爱机清理手机</li>-->
						</ul>
				</li>
				<li class="list-li">
					<img src="images/2_06.png"/>修电脑
						<ul class="list">
							<!--<li><span class="p1">屏幕></span> 屏碎但显示正常 | 屏幕不显示花屏|屏幕触摸失灵|Pad更换屏幕</li>
							<li><span class="p1">电池/充电/开机></span>电池问题|不开机|充电（连接）问题</li>
							<li><span class="p1">按键></span>开关机键失灵|Home键 失灵|音量键失灵</li>
							<li><span class="p1">声音/震动></span>听筒问题|麦克风问题|外放扬声器问题|二级插口故障|震动功能失效</li>
							<li><span class="p1">拍照/录像></span>后摄像头无法拍照|前摄像头故障问题</li>
							<li><span class="p1">外壳/边框></span>中框变形|手机壳换彩壳</li>
							<li><span class="p1">进入水液/主板故障></span>进入水液|手机主板故障</li>
							<li><span class="p1">其他故障></span>手机主板刷新|手机wifi信号问题</li>
							<li><span class="p1">个性化服务></span>点亮iphone logo|设置个性化彩壳|蓝光护眼钢化膜|爱机清理手机</li>-->
						</ul>
				</li>
				<li class="list-li">
					<img src="images/2_08.png"/>卖手机/电脑
						<ul class="list">
							<!--<li><span class="p1">屏幕></span> 屏碎但显示正常 | 屏幕不显示花屏|屏幕触摸失灵|Pad更换屏幕</li>
							<li><span class="p1">电池/充电/开机></span>电池问题|不开机|充电（连接）问题</li>
							<li><span class="p1">按键></span>开关机键失灵|Home键 失灵|音量键失灵</li>
							<li><span class="p1">声音/震动></span>听筒问题|麦克风问题|外放扬声器问题|二级插口故障|震动功能失效</li>
							<li><span class="p1">拍照/录像></span>后摄像头无法拍照|前摄像头故障问题</li>
							<li><span class="p1">外壳/边框></span>中框变形|手机壳换彩壳</li>
							<li><span class="p1">进入水液/主板故障></span>进入水液|手机主板故障</li>
							<li><span class="p1">其他故障></span>手机主板刷新|手机wifi信号问题</li>
							<li><span class="p1">个性化服务></span>点亮iphone logo|设置个性化彩壳|蓝光护眼钢化膜|爱机清理手机</li>-->
					</ul>
				</li>
				<li style="border:none" class="list-li">
					<img src="images/2_10.png"/>买二手机/Pad
						<ul class="list">
							<!--<li><span class="p1">屏幕></span> 屏碎但显示正常 | 屏幕不显示花屏|屏幕触摸失灵|Pad更换屏幕</li>
							<li><span class="p1">电池/充电/开机></span>电池问题|不开机|充电（连接）问题</li>
							<li><span class="p1">按键></span>开关机键失灵|Home键 失灵|音量键失灵</li>
							<li><span class="p1">声音/震动></span>听筒问题|麦克风问题|外放扬声器问题|二级插口故障|震动功能失效</li>
							<li><span class="p1">拍照/录像></span>后摄像头无法拍照|前摄像头故障问题</li>
							<li><span class="p1">外壳/边框></span>中框变形|手机壳换彩壳</li>
							<li><span class="p1">进入水液/主板故障></span>进入水液|手机主板故障</li>
							<li><span class="p1">其他故障></span>手机主板刷新|手机wifi信号问题</li>
							<li><span class="p1">个性化服务></span>点亮iphone logo|设置个性化彩壳|蓝光护眼钢化膜|爱机清理手机</li>-->
						</ul>
				</li>
			</ul>
		</div>
	</div>
	<div id="tu">
		<div id="tu1">
				<p><img src="images/2.jpg"/></p>
				<p><img src="images/10.jpg"></p>
				<p><img src="images/15.png"/></p>
				<p><img src="images/14.jpg"/></p>
		</div>
		<h2>热门手机回收</h2>
		<div id="tu2">
			<div id="tu2-a">
				<img src="images/4_03.png"/>
			</div>
			<ul>
			
			</ul>
		</div>
		<h2>优品精选</h2>
		<div id="tu3">
			<div id="tu3-a">
				<img src="images/4_06.png"/>
			</div>
			<ul>
				
			</ul>
		</div>
		<h2>到店进修</h2>
	</div>
	<div id="main">
		<div id="main1" class="fl">
			<input type="button" name="city" id="city" value="北京" />
			<p id="biao1">▼</p>
			<input type="button" name="qu" id="qu" value="选择区县" />
			<p id="biao2">▼</p>
			<div id="main-a">
				<input type="text" placeholder="输入您的位置查找附近的商家" name="" id="t1" value="" /><input type="button" name="" id="" value="搜索" />
			</div>
		</div>
		<div id="hid1">
			<div id="hid-a">
				<p>城市列表</p>
				<input type="button" name="" id="close1" value="关闭×" />
			</div>
			<div id="hid-b">
				<p><span class="cc">热门</span> 北京 上海 广州 天津 西安 深圳 武汉 成都 重庆</p>
				<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;南京 沈阳 杭州 济南 郑州 青岛 苏州</p>
				<p><span class="cc">拼音</span> A B C D E F G H J K L M N P Q R S T W X Y Z </p>
				<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;安阳 安庆 安康 阿克苏 阿亲泰 鞍山 安西 安顺</p>
				<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;阿里地区 阿拉善盟 阿坝</p>
			</div>
		</div>
		<div id="hid2">
			<div id="hid2-a">
				<p>区县列表</p>
				<input type="button" name="" id="close2" value="关闭×" />
			</div>
			<div id="hid2-b">
				<p>全部区县 海淀区 朝阳区 东城区 西城区 丰台区</p>
				<p>昌平区 密云县 怀柔区 大兴区 延庆县 顺义区</p>
				<p>石景山区 房山区 通州区 门头沟区 平谷区</p>
			</div>
		</div>
		<!--<div id="hid3">
			<p>可以搜索您所在的小区、写字楼或标志性建筑</p>
		</div>-->
		<div id="main2">
			<ul>
				<li>默认排序</li>
				<li>按成交量</li>
				<li>按人气</li>
				<li><input type="checkbox">先行赔付</li>
			</ul>
			<p class="map"><img src="images/1.png" /></p>
			
		</div>
		<div id="main3">
			<ul class="main3-a">
			
			</ul>
		</div>
		<div id="main-right" class="fr">
			<div class="mr1">
				<p>商家好评榜</p>
			</div>
			<div class="mr2">
				<ul>
				
				</ul>
			</div>
			<div class="page">
			
		</div>
		</div>
		
	</div>
	<div id="foot">
		<div id="foot-a">
			<ul>
				<li>
					<div class="foota-1"><img src="images/38.png"/></div>
					<div class="foota-2">
						<h3>购物指南</h3>
						<p>购物流程</p>
						<p>用户注册</p>
						<p>帮助文档</p>
					</div>
				</li>
				<li>
					<div class="foota-1"><img src="images/38.png"/></div>
					<div class="foota-2">
						<h3>购物指南</h3>
						<p>购物流程</p>
						<p>用户注册</p>
						<p>帮助文档</p>
					</div>
				</li>
				<li>
					<div class="foota-1"><img src="images/38.png"/></div>
					<div class="foota-2">
						<h3>购物指南</h3>
						<p>购物流程</p>
						<p>用户注册</p>
						<p>帮助文档</p>
					</div>
				</li>
				<li>
					<div class="foota-1"><img src="images/38.png"/></div>
					<div class="foota-2">
						<h3>购物指南</h3>
						<p>购物流程</p>
						<p>用户注册</p>
						<p>帮助文档</p>
					</div>
				</li>
				<li>
					<div class="foota-1"><img src="images/38.png"/></div>
					<div class="foota-2">
						<h3>购物指南</h3>
						<p>购物流程</p>
						<p>用户注册</p>
						<p>帮助文档</p>
					</div>
				</li>
			</ul>
			<div id="foot-b">
				<p>客服电话：400-399-360 / 010-53767360  投诉建议 网站地图</p>
				<p>Copyright &copy; 2005-2017 360.CN All Rights Reserved 360安全中心</p>
				<p>京ICP备08010314号-19 京公安备1100000000006号</p>
			</div>
		</div>
	</div>
<div id="mengban">
	<div id="container" tabindex="0">
		<div id="c-a">
			<h5>地图展示</h5>
			<p class="map-c"><a href="#">×</a></p>
		</div>
	</div>
	<div class="page page2">
			
	</div>
</div>
</body>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.min.js"></script>
<script src="js/baiduTemplate.min.js" type="text/javascript" charset="utf-8"></script>

<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.page.js" type="text/javascript" charset="utf-8"></script>
 <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=f9b3d8bc89572e8db969a6bfe8c98098"></script>
 <script type="text/javascript" src="js/index.min.js"></script>
<script type="text/javascript">
	
//获取数据
	//hot获取后台
	$.get("http://localhost:2222/data/hot.json",function(data){
//		console.log(data)
		$("#tu2 ul").html(baidu.template("bd",data))
	})
	//hot2获取后台
	$.get("http://localhost:2222/data/hot2.json",function(data){
//		console.log(data)
		$("#tu3 ul").html(baidu.template("bd1",data))
	})
	//好评榜获取后台
	$.get("http://localhost:2222/data/haopingbang.json",function(data){
//		console.log(data)
//		$(".main3-a").html(baidu.template("li",data))
		pageajax(1)
		
	})
	//好评榜2获取后台
	$.get("http://localhost:2222/data/haopingbang.json",function(data){
//		console.log(data)
		$(".mr2 ul").html(baidu.template("bd2",data))
	})
</script>
<script type="text/html" id="bd">
	<%for(var i = 0; i < result.length; i++){%>
		<li>
			<img src=<%=result[i].img_url%>>
			<p><%=result[i].model_alis%></p>
		</li>
	<%}%>
</script>
<script type="text/html" id="bd1">
	<%for(var i = 0; i < result.length; i++){%>
		<li>
			<img src=<%=result[i].thum_img.big%>>
			<p><%=result[i].model_name%></p>
			<p><%=result[i].price%></p>
		</li>
	<%}%>
</script>
<script type="text/html" id="li">
	<%for(var i in shop_data){%>
		<li><div class="tu">
				<img src=<%=shop_data[i].shop_ico%>>
			</div>
					<div class="zhong">
						<p class="lv"><%=shop_data[i].shop_name%> 店铺等级:</p>
						<p><%=shop_data[i].shop_desc%></p>
						<p><%=shop_data[i].addr%></p>
					</div>
					<div class="you">
						<p>￥先行赔付</p>
						<p>V同城帮认证</p>
						<p>人气：119910次浏览</p>
					</div>
					<div class="open">
						<p class="shopname"><a href="#">进入店铺</a></p>
					</div>
		</li>
	<%}%>
</script>
<script type="text/html" id="bd2">
	<%for(var i in shop_data){%>
		<li>
			<div class="mr2-a">①</div>
			<div class="mr2-b"><img src=<%=shop_data[i].shop_ico%>></div>
			<div class="mr2-c"><p class="lv"><%=shop_data[i].shop_name%></p><p>121683评论</p></div>
		</li>
	<%}%>
</script>
</html>